<template>
    <template v-for='(item, index) in menuData' :key='index'>
        <el-menu-item v-if='!Array.isArray(item.children)' :index='item.index'>
            <i class="el-icon-menu"></i>
            <template #title>{{item.title}}</template>
        </el-menu-item>
        <el-sub-menu :index='Math.floor(Math.random()*1000000)' v-else>
            <template #title>
                <i class="el-icon-location"></i>
                <span>{{item.title}}</span>
            </template>
            <MenuItem :menuData='item.children'/>
        </el-sub-menu>
    </template>
</template>

<script>
	export default {
		name: 'MenuItem',
        props: ['item', 'menuData']
	}
</script>

<style scoped>

</style>
